import React, { Component } from 'react'

export default class ShoppingList extends Component {
    constructor (props) {
        super(props);
        this.state = {}
    }
    render() {
        return (
            <>
                {this.props.list.map(item =>
                    <tr key={item.id} style={{ backgroundColor: 'skyblue' }}>
                        <td><input type="checkbox" checked={item.checked} onChange={() => this.props.changeChecked(item)} /></td>
                        <td>{item.id}</td>
                        <td>{item.goodsname}</td>
                        <td>￥{item.goodsprice}</td>
                        <td>￥{item.goodsprice * item.goodsnum}</td>
                        <td>
                            <button onClick={() => { this.props.num(item, -1) }} style={{ width: '20px' }}>-</button>
                            <input value={item.goodsnum} onChange={(e) => { this.props.changeNum(e.target.value, item) }} style={{ width: '50px' }}></input>
                            <button onClick={() => { this.props.num(item, 1) }} style={{ width: '20px' }}>+</button>
                        </td>
                        <td onClick={() => this.props.detele(item.id)}>删除</td>
                    </tr>
                )}
            </>
        )
    }
}
